/* isquirrelpoppix.js
 * 
 * Description: This script gets embedded into a webpage once the bookmarklet is clicked. It will open the iSquirrel Control
 * popup window, to give the user option to 'LIKE' the page, or navigate to their profile from the bookmarklet. 
 * 
 * iSquirrel
 * 2009
 * Imperial College London
 */


var poppix;

function Poppix(){  
	
	
	/** PRIVATE **/
	isWindowOK = false;
	configuredSites = [{ url: "wikipedia.org/wiki/", 
						 filter: function(){ return document.title.split(/\s-\s/)[0];}
					   },
					   { url: "youtube.com", 
						 filter: function(){ return document.title.substring(10);}
					   }
					  ];
	restrictedSites = ["wikipedia.org/wiki/Main_Page","wikipedia.org/wiki/File:"];
	
	/* setStyle() -> adapted from Prototype JS 1.6 */
	function setStyle(element, styles) {

		var elementStyle = element.style;
		
	    for (var property in styles){
			if (styles.hasOwnProperty(property)){
				elementStyle[(property == 'float' || property == 'cssFloat') ?
						(Object.isUndefined(elementStyle.styleFloat) ? 'cssFloat' : 'styleFloat') :
							property] = styles[property];
			}
		}
	    return element;
	 }
	
	function create_iframe(isShuffle) {
		
		var iframe = setStyle(document.createElement("iframe"),{
			
			position: "absolute",
			height: "60px",
			width: "470px",
			display: "block",
			border: "none",
			bottom: "50px",	
			left: "25px",
			zIndex: 1999,
			overflow: "hidden"

		});
		iframe.id="isqiframe";
		iframe.onload = function(){
				document.getElementById("isqloader").style.visibility='hidden';
				if (isShuffle){
					var i = document.getElementById("isqiframe");
					var r = document.getElementById("randomhref");
					setStyle(r, {visibility: "visible"});
					
					var address = i.contentWindow.document.body.innerHTML;
					
					if (address.indexOf("<div") > -1){
						setStyle(i, {visibility: "visible"});
						//set disabled style
						setStyle(r,{backgroundPosition: "0px 256px"});
						r.onclick = "return false;";
						r.onmouseover = "return false;"
					}
					else{
						r.href = address;
						r.addEventListener("mouseover", function(){ 
							
							r.style.backgroundPosition = "0px 256px";
							r.style.cursor = "pointer";
							var p = document.getElementById("pop");
							setStyle(p, {
										  backgroundImage:"url(http://websquirrel.net/iSquirrel/images/randompop.png)",
										  left: 193+"px",
										  display: "block"
										  });
							}, false);
						r.addEventListener("mouseout", function(){ document.getElementById("pop").style.display = "none";document.getElementById("randomhref").style.backgroundPosition = "0px 0px"; }, false);
					}
				}
		};
		
		document.getElementById('isqdiv').appendChild(iframe);
		return iframe;
	
	}
	 
	 function getTitleFiltered(url){
	 	
	 	for (var j in configuredSites){
			if (configuredSites.hasOwnProperty(j)){
				var c_site = configuredSites[j];
				if (url.indexOf(c_site.url) > -1){
					return c_site.filter();
				}
			}
	 	}
	 	return document.title;
	 }
	 
	 function isConfiguredFor(url){
		
		for (var i in configuredSites){
			if (configuredSites.hasOwnProperty(i)){
				var c_site = configuredSites[i].url;
				if (url.indexOf(c_site) > -1){
					for (var j in restrictedSites){
						if (restrictedSites.hasOwnProperty(j)){
							var r_site = restrictedSites[j];
							if (url.indexOf(r_site) > -1){
								return false;
							}
						}
					}
					return true;
				}
			}
		}
		return false;
	}
	
	/** PUBLIC **/
	this.init = function(){
	
		if (document.body.innerHTML !== ""){
			window.onload = function(){ isWindowOK = true; };
		}
		else {
			isWindowOK = true;
		}
	
	};


	this.checkWindowState = function(){
	
		if (isWindowOK !== true){
			window.setTimeout(this.checkWindowState,100);
		}
	
	};

	this.appear = function(elem){
		
	  setTimeout(function(){incOpacity_isqui(elem);}, 1);
	  
	  function incOpacity_isqui(elem){
		
		  var o = parseFloat(elem.style.opacity);
		  o += 0.01;
		  elem.style.opacity = o;
		  if (o < 1){
			setTimeout(function(){incOpacity_isqui(elem);}, 1);
		  }

	  }
	
	};

	this.load = function(){
	
		/* if we've already put one div on the page */
		if  (document.getElementById("isqdiv") !== null){
			return;
		}
	
		var frame = document.createElement("div");
	
		var frame_w = 500;
		var frame_h = 400;
	
		var top = (document.documentElement.clientHeight /2) - (frame_h/2);
		var left = (document.documentElement.clientWidth /2) - (frame_w/2);
		
		frame = setStyle(frame,{display: "block", 
							position: "fixed",
							height: frame_h+"px",
							width: frame_w+"px",
							top: top+"px",
							left: left+"px",
							backgroundImage: "url(http://websquirrel.net/iSquirrel/images/poppix.png)",
							zIndex: 2000,
							opacity: 0
							});
	
		frame.id = "isqdiv";	
	
		var isConfigured = false;
		if (isConfiguredFor(location.href)){
			isConfigured = true;
		}

	
		var backgroundp = "0px 0px";
		if (!isConfigured){
			backgroundp = "0px 128px";
		}
	
		var likediv = setStyle(document.createElement("div"), {
			position: "relative",
			top: "110px",
			left: "20px",
			//float: "left",
			backgroundImage:"url(http://websquirrel.net/iSquirrel/images/ilike.png)",
			display: "block",
			height: "128px",
			width: "128px",
			zIndex: 1999,
			backgroundPosition: backgroundp
		});
	
		//hack to get float to work
		likediv.style.cssFloat = likediv.style.styleFloat = "left";


		var profilediv = setStyle(document.createElement("div"), {
			position: "relative",
			top: "110px",
			marginLeft: "40px",
			backgroundImage:"url(http://websquirrel.net/iSquirrel/images/Wrench-128.png)",
			display: "block",
			//float: "left",
			height: "128px",
			width: "128px",
			zIndex: 1999
		});
		
		profilediv.style.cssFloat = profilediv.style.styleFloat = "left";

		var randomdiv = setStyle(document.createElement("a"), {
			position: "relative",
			top: "110px",
			marginLeft:"65px",
			backgroundImage:"url(http://websquirrel.net/iSquirrel/images/Internet-128.png)",
			display: "block",
			//float: "left",
			height: "128px",
			width: "128px",
			zIndex: 1999,
			visibility: "hidden"
		});
		
		randomdiv.id="randomhref";
		randomdiv.style.cssFloat = randomdiv.style.styleFloat = "left";
	
		
		var pop = setStyle(document.createElement("div"), {
			position: "relative",
			top: "238px",
			left: "20px",
			backgroundImage:"url(http://websquirrel.net/iSquirrel/images/likepop.png)",
			display: "none",
			height: "27px",
			width: "125px",
			zIndex: 1999
		});
		
		pop.id = "pop";
	
		var close = setStyle(document.createElement("div"), {
			position: "absolute",
			bottom: "10px",
			right: "20px",
			backgroundImage:"url(http://websquirrel.net/iSquirrel/images/closelabel.gif)",
			display: "block",
			height: "24px",
			width: "65px",
			zIndex: 1999
		});
			
		if (isConfigured){
			likediv.addEventListener("mouseover", function(){ 
				
											likediv.style.backgroundPosition = "0px 256px";
											likediv.style.cursor = "pointer";
											setStyle(pop, {
														  backgroundImage:"url(http://websquirrel.net/iSquirrel/images/likepop.png)",
														  left: 20+"px",
														  display: "block"
														  });
											}, false);
	
			likediv.addEventListener("mouseout", function(){ 
			
											pop.style.display = "none"; 
											likediv.style.backgroundPosition = "0px 0px"; }, 
											false);
			
			likediv.addEventListener("click", function(){ poppix.ilike(); }, false);

		}
	
		profilediv.addEventListener("mouseover", function(){ 
				
											profilediv.style.backgroundPosition = "0px 128px";
											profilediv.style.cursor = "pointer";
											setStyle(pop, {
														  backgroundImage:"url(http://websquirrel.net/iSquirrel/images/profilediv.png)",
														  left: 355+"px",
														  display: "block"
														  });
											}, false);
	
		profilediv.addEventListener("mouseout", function(){pop.style.display = "none";profilediv.style.backgroundPosition = "0px 0px"; }, false);
		profilediv.addEventListener("click", function(){ poppix.login(); }, false);
	
		var loader = setStyle(document.createElement("img"),{
			
			position: "absolute",
			bottom: "50px",	
			left: "25px",
			zIndex: 2000,
			display: "block",
			visibility: "hidden"
		});
		
		loader.id ="isqloader";
		loader.src="http://websquirrel.net/iSquirrel/images/barloader.gif";
	
		close.addEventListener("mouseover", function(){ close.style.cursor = "pointer"; }, false);
		close.addEventListener("click", function(){ poppix.close(); }, false);

		frame.appendChild(likediv);
		frame.appendChild(randomdiv);
		frame.appendChild(profilediv);
		frame.appendChild(pop);
		frame.appendChild(close);
		frame.appendChild(loader);

		document.body.appendChild(frame);
		
		/* we will load up a random url to assign a hyperlink to the shuffle button */
		var iframe = create_iframe(true);
		
		var params = isqzid.split("?")[1];
		
		iframe.src = "http://websquirrel.net/iSquirrel/servlet/Shuffle?" + params;
		iframe.style.visibility = "hidden";
	
		this.appear(frame);

	};

	this.ilike = function(){
		
		/* put this check at the start of your shuffle function */
		var tf = document.getElementById("isqiframe");
		if ( tf !== null){
			document.getElementById('isqdiv').removeChild(tf);
			tf = null;
		}
		
		document.getElementById("isqloader").style.visibility='visible';
		
		var pagetitle = getTitleFiltered(location.href);
		var pageurl = location.href;
		var params = isqzid.split("?")[1];
		params += "&source=0&url=" + pageurl + "&title=" + pagetitle.replace(/\s+/g,"+");
		
		/* create and append iframe -- use this function */
		var iframe = create_iframe(false);
		
		/* then set the src of the frame like this */
		iframe.src = "http://websquirrel.net/iSquirrel/servlet/iLike?" + params;
		
	};

	this.login = function(){
	
		window.open(isqzid);
	};

	this.close = function(){
	
		/* clean up */

		var isqdiv = document.getElementById("isqdiv");
		var ixsq = document.getElementById("ixsq");
		var insq = document.getElementById("insq");

		document.body.removeChild(isqdiv);
		document.body.removeChild(ixsq);
		document.body.removeChild(insq);
		
		/* take care of variables so no memory leaks occur */
		isqdiv=ixsq=insq=iframe=frame=pagetitle=pageurl=params=likediv=randomdiv=profilediv=pop=close=o=c_site=r_site=top=left=frame_h=frame_w=isWindowOK=restrictedSites=configuredSites=loader=null;
	
	};
	/** END OF POPPIX CLASS **/
}
	
	poppix = new Poppix();
	
	/* init Poppix on bookmarklet click */
	poppix.init();

	/* fire it up */
	poppix.load();
